<!--android header-->
<ion-header>
    <!--    <ion-toolbar class="ios-only" color="primary">-->
    <!--    </ion-toolbar>-->
    <ion-toolbar color="primary">
        <ion-buttons slot="primary">
            <ion-button [routerLink]="['/qrscan']">
                <ion-icon slot="icon-only" name="scan-outline"></ion-icon>
            </ion-button>
        </ion-buttons>
        <ion-searchbar placeholder="搜索" [(ngModel)]="fuzzySearch"
                       (ionChange)="currentIndex=1;showPageListData(null,true);getListCondition()"></ion-searchbar>
    </ion-toolbar>
</ion-header>

<ion-content *ngIf="PageSource.length>0 else showSkeletonScreen">

    <!-- 页面滚动区内容 -->
    <ul class="list">
        <!-- 模拟数据 -->
        <!--         <li *ngFor="let item of data">-->
        <!-- 真实数据 -->
        <li *ngFor="let item of PageSource" (click)="clickFun(item)">
            <!--        <li *ngFor="let item of PageSource" [routerLink]="['threeDimensional']"-->
            <!--            [queryParams]="{objpath: item.threeModelSet[0]?item.threeModelSet[0].modelUrl:null, mtlpath: item.threeModelSet[0]?item.threeModelSet[0].relatedUrl:null}">-->
            <div class="img">
                <img [src]="item.image&&item.image.trim().length>0?modelinfoService.fastdfsUrl+item.image:'assets/img/avator.jpeg'"
                     alt="avator"/>
            </div>

            <div class="right">
                <div class="title">
                    <h6>{{item.name}}</h6>
                    <p>{{item.code}}</p>
                    <p>{{item.typeid ? item.typeid.name : ''}}</p>
                    <p>{{item.note}}</p>
                </div>
                <div class="bottom">
                    <div>{{item.createuser}}</div>
                    <span>{{item.createtime}}</span>
                </div>
            </div>
        </li>
    </ul>

    <!-- 上拉加载下一页 -->
    <ion-infinite-scroll (ionInfinite)="doRefresh($event)" threshold="0%">
        <ion-infinite-scroll-content loadingText="{{loadingMoreText}}"></ion-infinite-scroll-content>
    </ion-infinite-scroll>

    <!-- 下拉刷新 -->
    <ion-refresher slot="fixed" pullMin="100" (ionRefresh)="doRefresh($event)">
        <ion-refresher-content pullingText="{{pullingText}}"
                               refreshingText="{{refreshingText}}"></ion-refresher-content>
    </ion-refresher>

</ion-content>
<ng-template #showSkeletonScreen>
    <ion-content>
        <!-- 下拉刷新 -->
        <ion-refresher slot="fixed" pullMin="100" (ionRefresh)="doRefresh($event)">
            <ion-refresher-content
                    pullingIcon="chevron-down-circle-outline"
                    pullingText="下拉刷新"
                    refreshingSpinner="circles"
                    refreshingText="正在刷新..."></ion-refresher-content>
        </ion-refresher>
        <app-loading [noData]="noData"></app-loading>
    </ion-content>
</ng-template>
